<%@ taglib prefix="s" uri="/struts-tags" %>
<%@ taglib prefix="sx" uri="/struts-dojo-tags" %>
<script type="text/javascript" src="<s:url value="/js/jquery/jquery.collapse.js"/>"></script>
<script type="text/javascript" src="<s:url value="/js/protocol/investigator.js"/>"></script>
<script type="text/javascript" src="<s:url value="/js/protocol/comiteEtica.js"/>"></script>
<script type="text/javascript" src="<s:url value="/js/protocol/site.js"/>"></script>
<script type="text/javascript" src="<s:url value="/js/protocol/siteStaff.js"/>"></script>

<s:form cssClass="tableFilter">

    <tr>
        <th colspan="2" class="tableTitle">
            <h5>Sites</h5>
        </th>
    </tr>
</s:form>

<s:if test="!list.isEmpty()">
    <div id="table_content">
        <table>
            <thead>
            <tr>
                <th>Institution</th>
                <th>PI</th>
                <th>SI</th>
                <th>Status</th>
                <th>Score</th>
                <th>
                </th>
            </tr>
            </thead>
            <tbody>
            <s:url var="editURL" action="edit"  namespace="/Staff"/>
            <s:iterator value="list" var="x">
                <tr>
                    <th><s:property value="protocoloCentro.centro.institucion"/></th>
                    <th><s:property value="principalInvestigator.nombre"/> <s:property value="principalInvestigator.apellido"/></th>
                    <th><s:property value="subInvestigator.nombre"/> <s:property value="subInvestigator.apellido"/></th>
                    <th><s:property value="status"/></th>
                    <th><s:property value="siteScore.name"/></th>
                    <th>
                        <s:form action="main" method="POST">
                            <s:url value="/images/edit.png" id="imageEdit"/>
                            <s:hidden value="%{id.investigadorid}" name="investigadorProtocoloCentro.id.investigadorid"/>
                            <s:hidden value="%{id.protocoloCentrocentroid}" name="investigadorProtocoloCentro.id.protocoloCentrocentroid"/>
                            <s:hidden value="%{id.protocoloCentroprotocoloCompromisopaisprotocoloid}" name="investigadorProtocoloCentro.id.protocoloCentroprotocoloCompromisopaisprotocoloid"/>
                            <s:hidden value="%{id.protocoloCentroprotocoloCompromisopaiscompromisopaisid}" name="investigadorProtocoloCentro.id.protocoloCentroprotocoloCompromisopaiscompromisopaisid"/>

                            <s:submit type="image" src="%{imageEdit}" cssStyle="width: 20px;height: 20px;" value="Edit"  ></s:submit>
                        </s:form>
                    </th>
                </tr>
            </s:iterator>

            <tbody>
        </table>
    </div>
</s:if>

<div id="filter">
<s:form theme="simple">
<table id="pic_table" class="tableFilter">
    <tbody>
        <s:url var="searchSitesURL" action="getSiteByInstitutionName"  namespace="/"/>
        <s:url var="searchPIURL" action="getInvestigatorsByNameSurname"  namespace="/Directories/Team"/>
        <s:url var="searchSIURL" action="getInvestigatorsSIByNameSurname"  namespace="/Directories/Team"/>
        <s:url var="searchComitesEticaURL" action="getComiteEticaByName"  namespace="/Directories/EthicsCommittee"/>
        <s:url var="searchInvURL" action="getInvolucradosByNameSurname"  namespace="/Directories/Team"/>

        <%--Here I hide ID info for editing--%>
        <s:hidden id="main_id_investigadorid" name="investigadorProtocoloCentro.id.investigadorid" value="%{investigadorProtocoloCentro.id.investigadorid}"/>
        <s:hidden name="investigadorProtocoloCentro.id.protocoloCentrocentroid" value="%{investigadorProtocoloCentro.id.protocoloCentrocentroid}"/>
        <s:hidden name="investigadorProtocoloCentro.id.protocoloCentroprotocoloCompromisopaisprotocoloid" value="%{investigadorProtocoloCentro.id.protocoloCentroprotocoloCompromisopaisprotocoloid}"/>
        <s:hidden name="investigadorProtocoloCentro.id.protocoloCentroprotocoloCompromisopaiscompromisopaisid" value="%{investigadorProtocoloCentro.id.protocoloCentroprotocoloCompromisopaiscompromisopaisid}"/>

        <tr>
            <td>
                <label>Site:</label>
            </td>
            <td>
                <!--It Sends SITE's ID to Server-->
                <s:textfield theme="simple"
                             name="investigadorProtocoloCentro.protocoloCentro.centro.id"
                             id="siteId" readonly="true" cssClass="load_hidden"/>

                <!--search field for SITES-->
                <s:textfield theme="simple" id="searchSite" value="%{investigadorProtocoloCentro.protocoloCentro.centro.institucion}"/>
                <s:a href="#" onclick="searchSites(
                                    $('#searchSite').val(),
                                    '%{searchSitesURL}')"
                theme="simple" >

                <img src="<s:url value="/images/search.png"/>" alt="search"></s:a>
                <label id="labelRequiredSite" style="color: red">*</label>

            </td>
        </tr>
        <tr>
            <td></td>
            <td>
        <!--listado de sites-->
        <div id="sites-show-hide" class="collapse" style="display: none;">
            <h3>More Information</h3>
            <div id="selected-site-Information" style="margin-bottom: 25px;">
            </div>
        </div>
        </td>
        </tr>




        <tr>
            <td>
                <label>Selected:</label>
            </td>
            <td>
                <s:checkbox name="selected" value="%{selected}" theme="simple" />
            </td>
        </tr>


        <tr>
            <td>
                <label>Justification:</label>
            </td>
            <td>
                <s:textarea name="investigadorProtocoloCentro.justification" value="%{investigadorProtocoloCentro.justification}" theme="simple" />
            </td>
        </tr>
        <s:if test="%{ comitesC.size() == 0}">

        <tr class="comiteEticaClass">
            <td>
                <label>Ethic Committee:</label>
            </td>

            <td>
                <!--It Sends COMMITTEE's ID to Server-->
                <s:textfield theme="simple"
                             name="comitesC[0].id"
                             readonly="true" cssClass="load_hidden"
                             value=""/>

                <!--search field for COMMITTEE-->
                <s:textfield theme="simple" value="" />
                <s:a href="#" onclick="searchComitesEtica(
                                    $(this).prev(),
                                    '%{searchComitesEticaURL}')"
                     theme="simple" >

                <img src="<s:url value="/images/search.png"/>" alt="search"></s:a>
            </td>

            <td><a onclick="deleteRowCE($(this).parent().parent())"><img src="<s:url value="/images/delete2.png"/>" alt="Delete"></a></td>
          </tr>
        </s:if>
        <s:else>
        <s:iterator value="%{comitesC}"  status="stat">
             <tr class="comiteEticaClass">
                <td>
                    <label>Ethic Committee:</label>
                </td>

                <td>
                <s:textfield theme="simple"
                             name="comitesC[%{#stat.index}].id"
                             readonly="true" cssClass="load_hidden"
                             value="%{comitesC[#stat.index].id}"
                             />

                <s:textfield theme="simple" value="%{comitesC[#stat.index].name}" />
                <s:a href="#" onclick="searchComitesEtica(
                                    $(this).prev(),
                                    '%{searchComitesEticaURL}')"
                     theme="simple" >

                    <img src="<s:url value="/images/search.png"/>" alt="search"></s:a>
                </td>

                <td><a onclick="deleteRowCE($(this).parent().parent())"><img src="<s:url value="/images/delete2.png"/>" alt="Delete"></a></td>
                </tr>
            </s:iterator>
        </s:else>
        <tr>

            <td><a onclick="addRowCommiteeC($(this).parent().parent().prev())"><img src="<s:url value="/images/add2.png"/>" alt="Add Row"></a></td>

        </tr>

        <tr>
            <td>
                <label>Score:</label>
            </td>
            <td>
                <s:select name="siteScoreC" headerKey="-1" headerValue=""
                          listKey="id" listValue="name" list="scores"
                          value="investigadorProtocoloCentro.siteScore.id" theme="simple"/>
            </td>
        </tr>


            <tr>
                <td><div class="div_padding"></div></td>
                <td></td>
            </tr>


        <tr>
            <td>
                <label>PI Current Position</label>
            </td>
            <td>
                <s:textfield theme="simple" name="investigadorProtocoloCentro.piPosition"
                             id="piPosition" value="%{investigadorProtocoloCentro.piPosition}" />
            </td>
        </tr>


        <tr>
            <td>
                <label>Principal Investigator</label>
            </td>
            <td>
                <!--It Sends PI's ID to Server-->
                <s:textfield theme="simple"
                             name="investigadorProtocoloCentro.principalInvestigator.id"
                             id="piId" readonly="true" cssClass="load_hidden"/>

                <!--search field for Involucrados-->
                <s:textfield theme="simple" id="searchPI" />
                <label id="labelRequiredPI" style="color: red">*</label>

            <%--Only for edition--%>
                <s:hidden theme="simple" id="piNombre" value="%{investigadorProtocoloCentro.principalInvestigator.nombre}"/>
                <s:hidden theme="simple" id="piApellido" value="%{investigadorProtocoloCentro.principalInvestigator.apellido}"/>
                <s:hidden theme="simple" id="piCuit" value="%{investigadorProtocoloCentro.principalInvestigator.cuit}"/>
                <s:hidden theme="simple" id="piDegree" value="%{investigadorProtocoloCentro.principalInvestigator.degree}"/>
                <s:hidden theme="simple" id="piEmail" value="%{investigadorProtocoloCentro.principalInvestigator.email}"/>
                <s:hidden theme="simple" id="piFax" value="%{investigadorProtocoloCentro.principalInvestigator.fax}"/>
                <s:hidden theme="simple" id="piPhone" value="%{investigadorProtocoloCentro.principalInvestigator.phone}"/>

                <s:a href="#" onclick="searchInvestigator(
                                    $('#searchPI').val(),
                                    '%{searchPIURL}')"
                     theme="simple" >

                    <img src="<s:url value="/images/search.png"/>" alt="search"></s:a>

            </td>
        </tr>

        <tr>
            <td></td>
            <td>
                <!--listado de investigator-->
                <div id="pi-show-hide" class="collapse" style="display: none;">
                    <h3>More Information</h3>
                    <div id="selected-pi-Information" style="margin-bottom: 25px;">
                    </div>
                </div>
        </tr>


        <tr>
            <td><div class="div_padding"></div></td>
            <td></td>
        </tr>

        <tr>
            <td>
                <label>Sub Investigator</label>
            </td>
            <td>
                <!--It Sends SI's ID to Server-->
                <s:textfield theme="simple"
                             name="investigadorProtocoloCentro.subInvestigator.id"
                             id="siId" readonly="true" cssClass="load_hidden"/>

                <!--search field for Involucrados-->
                <s:textfield theme="simple" id="searchSI"/>

                <%--Only for edition--%>
                <s:hidden theme="simple" id="siNombre" value="%{investigadorProtocoloCentro.subInvestigator.nombre}"/>
                <s:hidden theme="simple" id="siApellido" value="%{investigadorProtocoloCentro.subInvestigator.apellido}"/>
                <s:hidden theme="simple" id="siCuit" value="%{investigadorProtocoloCentro.subInvestigator.cuit}"/>
                <s:hidden theme="simple" id="siDegree" value="%{investigadorProtocoloCentro.subInvestigator.degree}"/>
                <s:hidden theme="simple" id="siEmail" value="%{investigadorProtocoloCentro.subInvestigator.email}"/>
                <s:hidden theme="simple" id="siFax" value="%{investigadorProtocoloCentro.subInvestigator.fax}"/>
                <s:hidden theme="simple" id="siPhone" value="%{investigadorProtocoloCentro.subInvestigator.phone}"/>

                <s:a href="#" onclick="searchInvestigator(
                                    $('#searchSI').val(),
                                    '%{searchSIURL}')"
                     theme="simple" >

                    <img src="<s:url value="/images/search.png"/>" alt="search"></s:a>
            </td>
        </tr>
        <tr>
            <td></td>
            <td>
                <!--listado de investigator-->
                <div id="si-show-hide" class="collapse" style="display: none;">
                    <h3>More Information</h3>
                    <div id="selected-si-Information" style="margin-bottom: 25px;">
                    </div>
                </div>
            </td>
        </tr>


        <s:if test="%{ investigadorProtocoloCentro == null || investigadorProtocoloCentro.siteStaff.isEmpty()}">

        <tr class="siteStaffClass">
            <td>
                <label>Role:</label>
            </td>
            <td>
                <s:select name="siteStaff[0].role.id" headerKey="-1" headerValue=""
                          listKey="id" listValue="descripcion" list="sitesRoles"
                          value="%{siteStaff[0].role.id}" theme="simple"/>
            </td>

            <td>
                <label>Name:</label>
            </td>

            <td>
                <s:textfield theme="simple"
                             name="siteStaff[0].involucrado.id"
                             readonly="true" cssClass="load_hidden"
                             value=""/>

                <s:textfield theme="simple" value="" />
                <s:a href="#" onclick="searchSiteStaff(
                                    $(this).prev(),
                                    '%{searchInvURL}')"
                     theme="simple" >

                    <img src="<s:url value="/images/search.png"/>" alt="search"></s:a>
            </td>

            <td>
                <label>Safety:</label>
            </td>
            <td>
                <s:checkbox name="siteStaff[0].safety"
                            value="%{siteStaff[0].safety}" theme="simple" />
            </td>

            <td><a onclick="deleteRowSS($(this).parent().parent())"><img src="<s:url value="/images/delete2.png"/>" alt="Delete"></a></td>

        </tr>
            </s:if>
            <s:else>
            <s:iterator value="investigadorProtocoloCentro.siteStaff"  status="stat">
            <tr class="siteStaffClass">
                <td>
                    <label>Role:</label>
                </td>
                <td>
                    <s:select name="siteStaff[%{#stat.index}].role.id" headerKey="-1" headerValue=""
                              listKey="id" listValue="descripcion" list="sitesRoles"
                              value="%{investigadorProtocoloCentro.siteStaff[#stat.index].role.id}" theme="simple"/>
                </td>

                <td>
                    <label>Name:</label>
                </td>

                <td>
                    <s:textfield theme="simple"
                                 name="siteStaff[%{#stat.index}].involucrado.id"
                                 readonly="true" cssClass="load_hidden"
                                 value="%{investigadorProtocoloCentro.siteStaff[#stat.index].involucrado.id}"/>

                    <s:textfield theme="simple" value="%{investigadorProtocoloCentro.siteStaff[#stat.index].involucrado.nombre} %{investigadorProtocoloCentro.siteStaff[#stat.index].involucrado.apellido}"/>
                    <s:a href="#" onclick="searchSiteStaff(
                                    $(this).prev(),
                                    '%{searchInvURL}')"
                         theme="simple" >
                        <img src="<s:url value="/images/search.png"/>" alt="search"></s:a>
                </td>

                <td>
                    <label>Safety:</label>
                </td>
                <td>
                    <s:checkbox name="siteStaff[%{#stat.index}].safety"
                                value="%{siteStaff[#stat.index].safety}" theme="simple" />
                </td>

                <td><a onclick="deleteRowSS($(this).parent().parent())"><img src="<s:url value="/images/delete2.png"/>" alt="Delete"></a></td>
            </tr>
        </s:iterator>
        </s:else>
        <tr>

            <td><a onclick="addRowSiteStaff($(this).parent().parent().prev())"><img src="<s:url value="/images/add2.png"/>" alt="Add Row"></a></td>

        </tr>

        <tr>
            <td colspan="2">

                <!--listado de cda-->
                <div id="cda-show-hide" class="collapse" style="display: none;width: 100%;">
                    <h3>Confidential Disclosure Agreement</h3>
                    <div id="selected-cda-Information" style="margin-bottom: 25px;">
                    </div>
                </div>
            </td>
        </tr>


        <tr>
            <td colspan="4"><s:submit value="Save" action="save" theme="simple" onclick="return validate()"/>
                <s:submit value="Clear" action="main" onclick="$('#main_id_investigadorid').val('');" theme="simple"/>
            </td>
        </tr>
    </tbody>
    </table>
    </s:form>


</div>

<script type="text/javascript">
    selectItemMenu("sites");


    //cargo los elementos con comportamiento collapse
    var ids = [["sites-show-hide",false],["pi-show-hide",false],["si-show-hide",false], ["cda-show-hide",false]];
    loadCollapse(ids);

    function loadSite(){
        var id = $('#siteId').val();
        var institution = $('#searchSite').val();

        var site = Site(id,undefined,institution,undefined,undefined);
        closeWindows(site);
    }

    function loadInvestivator(index){
        var suphix = index==0?'pi':'si';
        var id = $('#'+suphix+'Id').val();
        var nombre = $('#'+suphix+'Nombre').val();
        var apellido = $('#'+suphix+'Apellido').val();
        var cuit = $('#'+suphix+'Cuit').val();
        var degree = $('#'+suphix+'Degree').val();
        var email = $('#'+suphix+'Email').val();
        var fax = $('#'+suphix+'Fax').val();
        var phone = $('#'+suphix+'Phone').val();

        var investigator = Investigator(id,nombre,apellido,cuit,degree,email,fax,phone);
        closeWindowsInvestigaror(investigator, index);
    }

    /*muestra collapses para la edicion*/
    function init(){
        if(!$.isEmptyObject($('#main_id_investigadorid').val())){
            loadSite();
            loadInvestivator(0);
            loadInvestivator(1);
        }
    }

    window.onload=init;

</script>
